<template>
  <div v-loading="loading">
    <el-form label-width="80px" label-position="right">
      <el-row :gutter="8">
        <el-col :span="8">
          <el-form-item label="样品编号">
            <el-input v-model="filterModel.sampleNo" clearable placeholder="根据样品编号搜索原始记录" @change="filterChange('sampleNo')"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="检测项目">
            <el-input v-model="filterModel.itemName" clearable placeholder="根据检测项目搜索原始记录" @change="filterChange('itemName')"></el-input>
          </el-form-item>
        </el-col>
        <el-col v-if="activeName && $labProcess.info.activityState === 'runing'" :span="8">
          <el-button style="margin-right: 2px;margin-left: 0" icon="iconfont icon-submit-up" :loading="$labProcess.info.executeIng" type="success" @click="recordProcess('submit')">提交</el-button>
          <template v-if="$labProcess.info.backs && $labProcess.info.backs.length">
            <el-button style="margin-right: 2px;margin-left: 0" icon="iconfont icon-back-one" :loading="$labProcess.info.executeIng" type="warning" @click="recordProcess('back')">退回</el-button>
          </template>
        </el-col>
      </el-row>
    </el-form>
    <el-empty v-if="allRecords.length === 0" description="未获取到已绑定原始记录">
      <el-button icon="el-icon-refresh" type="text" title="刷新" :disabled="loading" @click="loadSource([])" >重新加载</el-button>
    </el-empty>
    <el-tabs v-else v-model="activeName" type="border-card">
      <el-tab-pane v-for="record in allRecords" :key="record.key" :name="record.key" :label="record.label">
        <lab-view :model-data="record.modelData" :element="record.element" style="width: 100%;height: calc(100vh - 200px);overflow: auto"></lab-view>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import LabBase from "@/mixins/LabBase";
import IdeaTable from "@/mixins/IdeaTable";
import LabView from "@/components/lab-view/LabView";

export default {
  name: "LimsRecordTab",
  components: {LabView},
  mixins: [LabBase, IdeaTable],
  inject: {
    /**
     * 流程方法注入
     */
    $labProcess: {
      from: '$labProcess',
      default: function () {
        return undefined
      }
    },
    $LabWeb: {
      from: '$LabWeb',
      default: function () {
        return undefined
      }
    }
  },
  created() {
    this.init()
  },
  data() {
    return {
      activeName: '',
      config: {},
      allRecords: []
    }
  },
  methods: {
    init() {
      const { activityType, keys } = this.$labProcess.info
      // 扩展设置
      this.config = this.appInfo.envs[activityType] || {}
      this.rowKey = 'recordId'
      this.pageInfo.pageSize = 50
      this.addFilter({field: 'itemId', op: 'in', value: keys })
      const { callTabs } = this.config
      if (callTabs) {
        this.queryUrl = '/method/callMethod/' +  callTabs
      }
      this.loadSource()
    },
    loadComplate() {
      this.allRecords.splice(0, this.allRecords.length)
      if (this.dataSource.length === 0) {
        return
      }
      this.dataSource.forEach(item => {
        this.allRecords.push({
          element: { props: { callCmd: item.viewId },elements: [] },
          modelData: item,
          key: item.recordId,
          label: item.recordName
        })
      })
      const record = this.allRecords.find(item => item.key === this.activeName)
      if (!record) {
        this.activeName = this.allRecords[0].key
      }
    },
    recordProcess(type) {
      const args = { entityType: 'recordId', entityValue: this.activeName }
      if (type === 'submit') {
        this.$labProcess.submit(args)
            .then(res => {
              this.refreshRecord(res)
            })
      } else {
        this.$labProcess.back(args)
            .then(res => {
              this.refreshRecord(res)
            })
      }
    },
    refreshRecord(res) {
      this.$resultMsg(this, res)
      if (res.code === 200) {
        this.allRecords = this.allRecords.filter(item => item.key !== this.activeName)
        if (this.allRecords.length > 0) {
          this.activeName = this.allRecords[0].key
        } else {
          this.$LabWeb.refreshTag(this.$route.path)
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
